<!--
 * @Descripttion: 
 * @version: 
 * @Author: wtzhang
 * @Date: 2021-05-28 16:14:58
 * @LastEditors: wtzhang
 * @LastEditTime: 2021-06-01 16:27:49
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>论坛·登录</title>
  <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css">
  <link rel="stylesheet" href="/public/css/login.css">
</head>

<body>
  <div class="main">
    <div class="header">
      <a href="/">
        <img src="/public/img/logo3.png" alt="" width="200px">
      </a>
      <br>
      <br>
      <h1>用户登录</h1>
      <br>
    </div>
    <form id="login_form">
      <div class="form-group">
        <label for="email">邮箱</label>
        <input type="email" class="form-control" id="email" name="email" placeholder="Email" autofocus>
      </div>
      <div class="form-group mr-b10">
        <label for="password">密码</label>
        <input type="password" class="form-control" id="password" name="password" placeholder="Password">
      </div>
      <div class="checkbox">
        <label>
          <input type="checkbox">记住我
        </label>
        <a class="pull-right" href="" style="font-size: 12px;">忘记密码？</a>
      </div>
      <button type="submit" class="btn btn-success btn-block">登录</button>
    </form>
    <div class="message">
      <p>没有账号? <a href="/register" class="font12">点击创建</a>.</p>
    </div>
  </div>
  <script src="/node_modules/jquery/dist/jquery.js"></script>
  <script>
    $('#login_form').on('submit', function(e){
      e.preventDefault()
      let formData = $(this).serialize()
      // console.log(formData);
      $.ajax({
        url: '/login',
        type: 'post',
        data: formData,
        dataType: 'json',
        success: function(data){
          let code = data.err_code;
          if (code === 0) {
            window.alert('登录成功！')
            window.location.href = '/'
          } else if (code === 1) {
            window.alert('邮箱或者密码错误，请重新输入！')
          } else {
            window.alert(data.message)
          }
        }
      })
    })
  </script>
</body>

</html>
